*{
	margin:0;
	padding:0;	
}

body, html{
	background: #f0f0f0;
	font: 14px/1.8 'Microsoft Yahei','\5FAE\8F6F\96C5\9ED1',Arial,'Hiragino Sans GB','\5B8B\4F53';
	/*color: #666*/
	/*color:#000;*/
	color:#475569;
}

*, ::after, ::before {
    box-sizing: border-box;
}

header,nav,main,footer,article,time,aside,input,textarea,select,button{
    display: block;
}

header,nav,main,footer,ul,a{
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline;
}

img{ border:none;}

ol,ul{
	list-style: none;
}

a {
    /*color: #5e5e5e;*/
	/*color:#000;*/
	color:#475569;
    text-decoration: none;
}

a:hover, a:link, a:visited {
    text-decoration: none;
}

a:hover {color: #f60;}

.fl {
    float: left;
}

.fr {
    float: right;
}

.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  max-width: 1140px;
  width:1140px;
}

.clearfix:after, .container:after{
	clear: both
}

.clearfix:after,.clearfix:before,.container:after,.container:before {
	content: ""
}

.clearfix:after,.clearfix:before,.container:after,.container:before {
	display: table
}

.clearfix {zoom: 1}
header{margin-bottom: 10px;	}
header .logo a{ margin:0.5rem 0 0;}
header .name {padding:0.8rem 0;}
.brand{background: #fff;}

.brand .name {
    font-size: 24px;
    color: #333;
    line-height: 28px;
}

.navbar-bg{
    background: #458fd2;
    box-shadow: 0 0 1px rgba(255,255,255,.15);
}

.navbar ul li {
    float: left;
    margin-right: 5px;
    position: relative;
    display: inline;
    z-index: 2;
}

.navbar ul li a {
    display: block;
    line-height: 50px;
    font-size: 16px;
    padding: 0 15px;
}

.navbar-bg a, .navbar-bg a:hover {
    color: #fff;
}

.navbar ul li a:hover {
	background: #474e5d;
	color: #fff
}

@media screen and (max-width:768px) {
	.container {
		width:auto;
		max-width: 750px;
	}
	
	.brand .name {
		display: block;
		text-align: center;
	}
	
	.brand #name{
		display:inline;
		float:none;
	}
	
	.navbar ul li {
		width: 33%;
		min-width: 80px;
		box-sizing: border-box;
		margin-right: 0
	}

	.navbar ul li a {
		line-height: 32px;
		font-size: 14px;
		padding: 0 10px
	}
}

@media screen and (min-width: 768px) {
  .container {
    max-width: 1140px;
	width:1140px;
  }
}

main{ margin-bottom:0px;}
.index-first{ background:#FFF; padding:10px; margin-bottom:10px;}
#fsilder{width:430px; height:300px;}
#last{padding:0 15px; width:340px;}
#hot{padding:0;width:340px;}
.index-first h4{ font-size:18px; font-weight:bold; padding-bottom:5px; border-bottom:1px solid #ccc;white-space:nowrap;}
.index-first ul{white-space:nowrap;}
.index-first ul li{ padding:5px 0 0 0; overflow:hidden;}
.index-first ul li a:before{content:"▪ ";}
.index-first a{ font-size:16px;}
.index-first a:hover {color: #f60;}
@media screen and (max-width:768px) {
#fsilder{width:100%;}
#last{width:100%;padding:10px 0;}
#hot{width:100%;padding:10px 0;}
}

.index-second{ background-color:#FFF;}
.index-second-item{ width:50%; padding:10px 15px;}
.index-second-item h4{ font-size:18px; font-weight:bold; padding-bottom:5px; margin-bottom:5px; border-bottom:1px solid #ddd;white-space:nowrap;}
.index-second-item ul{white-space:nowrap;}
.index-second-item ul li{ padding:5px 0 0 0; overflow:hidden;}
.index-second-item ul li a{ font-size:16px;}
.index-second-item ul li a:hover {color: #f60;}
.index-second-item .time{ color:#999; font-size:12px;}
.index-second-item .more{ padding-top:10px; font-size:12px;}

@media screen and (max-width:768px) {
.index-second-item{ width:100%;}
}

.friend{background:#FFF; padding:0 0 5px; margin-bottom:10px;}
.friend .title {
    border-bottom: 1px solid #E7E6FA;
    color: #515151;
    font-size: 14px;
    font-weight: bold;
    margin: 11px 5px 3px 8px;
    padding: 5px 0;
}

.friend .link {
    line-height: 24px;
    padding: 10px 5px 8px 8px;
}

.copyright {
	position:relative;
    line-height: 22px;
    text-align: center;
    margin: 2rem auto 1rem;
    padding: 1rem 0;
	font-size:12px;
}

.copyright:before{
	content: "";
    display: block;
    position: absolute;
    width: 20px;
    height: 4px;
    background: #999;
    border-radius: 4px;
    top: 0;
    left: 50%;
    margin-left: -10px;
}

/*page*/
.primary {float: left; width: 100%;}
.sidebar{width: 360px; margin-left: -360px; display: inline;}
.bread{ background:#fff; padding:10px 15px; margin-bottom:10px; margin-right:375px;border-radius: 4px;}
.article-list{ margin-right:375px;}
.article-list article{ background:#FFF; padding:15px; margin-bottom:15px;border: 1px solid #e6e6e6; border-radius: 4px;}
.article-list article h2{font-size: 22px; font-weight:400; margin-bottom:10px;}
.article-list article h2 a {color: #444;}
.article-list article h2 a:hover{color: #f60;}
.article-list article time{margin-bottom: 10px; color: #a5a5a5;  font-size: 12px;  overflow: hidden;}
.article-list article p{position: relative; padding-top: 10px; margin-bottom: 10px; font-size:16px;}
.article-list article p .readmore{ margin-left:0.8rem;}
.article-list article p .readmore a {color: #929292; font-size: small;}
.article-list .page strong,.article-list .page span{ padding:0 10px;}
.article-list .page a {display: inline-block; padding: 0 10px; background-color: #fbfbfb;  border: 1px solid #e7e7e7; border-radius: 3px; background: #CCC; color: #fff;}
.article-list .page {text-align: center; padding: 10px 10px 40px 10px; font-size: 18px;}
.article-list .page a:hover{background-color:#45b823;color: #fff;}
.sidebar aside {background: #fff; margin-bottom: 15px; border: 1px solid #e6e6e6;  border-radius: 4px; padding: 15px;}
.sidebar aside h3{font-size: 15px; color: #666; margin-bottom: 10px; font-weight:700;}
.sidebar aside ul li {line-height: 30px; margin-bottom: 4px; word-break: break-all;}
.sidebar aside ul li a{font-size:14px;}
.sidebar aside ul li time { display:inline; margin-bottom: 10px;  color: #a5a5a5;   font-size: 12px;   overflow: hidden;}

@media screen and (max-width:768px) {
.primary {float:none; width: 100%;}
.sidebar{ float:none; width:100%;}
.bread,.article-list{ margin-right:0;}
}

/*detail*/
.article{ background:#FFF; margin-right:375px; padding:15px; margin-bottom:20px;border: 1px solid #e6e6e6; border-radius: 4px;}
.article h1{font-size: 24px; margin-bottom: 10px; font-weight:400; text-align:center;}
.article .meta {margin-bottom: 10px;color: #a5a5a5;font-size: 12px; text-align:center; overflow: hidden; border-bottom:1px solid #dddddd; padding-bottom:1rem;}
.article .meta time{ display:inline;}
.article .content {position: relative;  padding-top: 10px; margin-bottom:25px;}
.article .content p{font-size: 16px; text-indent:2em; letter-spacing: .25px; line-height: 2.5rem; margin-bottom: 1rem; word-break: break-all;word-wrap: break-word; overflow:hidden;}
.article .content p img{width:auto; height:auto; max-width:85%; display:block; margin:0 auto;}
.article .content pre{border-radius: 3px;background-color: #f5f5f5;font-family: Courier New !important; font-size: 12px !important;border: 1px solid #ccc; padding: 15px; margin: 15px 2em; overflow:auto;}
@media screen and (max-width:768px) {
	.article .content p{ line-height:2.5rem; margin-bottom: 0.5rem;}
	/*.article .content p img{ width:auto; height:auto; max-width:85%; display:block; margin:0 auto;}*/
}
.article .content.cpg{ padding-bottom:20px;}
.article .content .cpg a,.cpg span{ padding:4px 9px;margin-right:8px;}
.article .content .cpg a{border: 1px solid #DCDDDD; }
.article .content .cpg span{ background:#2D96E9; color:#FFFFFF;}
.article .content .cpg a:hover{ background:#2D96E9; color:#FFFFFF;}
.article .article-nav{ margin-bottom:25px;}
.article .article-nav dl {line-height: 30px;}

/*文章评论*/
.article-comment .cancel-reply {float: right;cursor: pointer;padding-right: 10%}
.article-comment .cancel-reply:hover {text-decoration: underline}
.article-comment form{ height:250px;}
.article-comment textarea,.article-comment input{outline: none;}
.article-comment textarea{ width:100%; height: 130px; resize:none; border: 1px #d6d6d6 solid; border-radius: 10px 10px 0 0; padding: 10px; line-height: 1.5;font:400 13.3333px Arial;}
.article-comment .author-info{ margin-top:-1px;}
.article-comment input{padding: 7px 10px;color: #6c757d;}
.article-comment input[type=text]{small;width: 50%;line-height: 1.5;height: 50px; border: 1px solid #ced4da;}
.article-comment input[name=poster]{border-bottom-left-radius: 10px !important;border-right: 0px;}
.article-comment input[name=contact]{border-right: 1px #d6d6d6 solid !important;border-bottom-right-radius: 10px !important;}
.article-comment p{ margin:5px 0 16px;line-height: 2;}
.article-comment p input{width: auto; font-weight: 800; height: 35px; text-align: center; font-size: inherit; margin: 10px 0px;float: right; margin-right: 1px; border-radius: 8px;border: 1px solid #dedede; cursor:pointer;}
.article-comment p input:hover {color: #fff; background-color: #007bff; border-color: #007bff;}
.article-comment .comment-item{margin: 10px 0;padding: 10px 0px;border-bottom: 1px #f7f7f7 solid;overflow: hidden;color: #333;zoom: 1}
.article-comment .comment-item .avatar {float: left;margin: 5px 4px}
.article-comment .comment-item .avatar img {margin-top: 9px;margin-right: 4px;border-radius: 50%;}
.article-comment .comment-item .info {background: #f7f7f7;padding: 12px;padding-bottom: 5px;border-radius: 8px;margin-top: 9px;margin-left: 58px}
.article-comment .comment-item .arrow {position: absolute;margin-top: 3px;margin-left: -34px;border-width: 13px;border-style: solid;border-color: transparent #f7f7f7 transparent transparent}
.article-comment .comment-item time {color: #999999;display: inline;font-size: 10px}
.article-comment .comment-item .content {margin: 8px 0px 0px 0px;word-break: break-word}
.article-comment .comment-item .reply {font-size: 12px;cursor: pointer;margin-top: 5px}
.article-comment .comment-item .reply:hover {text-decoration: underline}
.article-comment .comment-item .reply a{transition: all 0.2s;}
.article-comment .comment-item .comment-item-children {margin: 20px 10px 20px 20px;clear: both;border: none;padding: 0}
@media screen and (max-width:768px){
	.article-comment .comment-item .info {/*float: left;*/margin-left: unset;width: 100%}
	.article-comment .comment-item .arrow{ display:none;}
    .article-comment p input{height: 44px}
    .article-comment .comment-item .arrow {position: absolute;margin-left: -1px;margin-top: -37px;border-width: 13px;border-style: solid;border-color: transparent transparent #f7f7f7 transparent}
    .article-comment textarea, .article-comment input[type=text] {border-radius: 0;width: 100%;}
    .article-comment input[type=text] {border: 1px solid #ced4da;border-radius: 0px !important;margin-top: 10px; float:none;}
    .article-comment form {height: 325px; }
}

.article .related{}
.article .related h3{color: #3991e5; margin: 20px 0 15px; font-size: 20px; font-weight:400;}
.article .related ul{margin: 0 0 15px;}
.article .related ul li {width: 48%; margin-right: 1%; line-height: 32px;  height: 32px;  overflow: hidden;}
.article .related ul li { display: inline-block;  font-size: 14px;  vertical-align: top;  letter-spacing: normal;  word-spacing: normal;white-space: nowrap;}
.article .related ul li a {font-size:16px;}
@media screen and (max-width:768px) {
.article{ margin-right:0;}
}

.article .content cite { font-style:normal; }
.article .content cite a{ display:block; display: flex; width:60%; margin:0 auto; border-radius: 8px;background-color: #f6f6f6;padding: 12px;}
@media screen and (max-width:768px) {
.article .content cite a{ width:100%;}
}
.article .content cite img{ width:75px; height:75px; border-radius: 6px;}
.article .content cite .box{ margin-left:12px; position:relative;}
.article .content cite .first { max-height: 42px; text-indent:0; -moz-box-orient: vertical; color: #121212; display: -webkit-box; font-size: 15px; font-weight: 600; line-height: 21px;overflow: hidden;text-overflow: ellipsis;}
.article .content cite .second{ text-indent:0; line-height:18px;color: #999; font-size: 13px;font-weight: 400;}
.article .content cite a .third{text-indent:0; position: absolute; width: 100%; bottom:0;}
.article .content cite a .third .a{ position:absolute; bottom:0; left:0;}
.article .content cite a .third .b{ position:absolute; bottom:0; right:0;}
.article .content cite a .third .a,.article .content cite a .third .b{color: #ff7955; font-size: 13px; font-weight: 600; line-height: 13px;}